TypeScript Enum Alternativer: Const Assertions vs. Union Types

TypeScripts enum er en kraftig funksjon for å definere et sett med navngitte konstanter. Det er imidlertid ikke alltid det beste valget. Denne artikkelen utforsker alternativer til enums, spesifikt const assertions og union types, og gir veiledning om når du skal bruke hver for optimal kodekvalitet, vedlikehold og ytelse. Vi vil fordype oss i nyansene i hver tilnærming, og tilby praktiske eksempler og adressere vanlige bekymringer.

Forstå TypeScript Enums

Før vi dykker ned i alternativer, la oss raskt se gjennom TypeScript enums. En enum er en måte å definere et sett med navngitte numeriske konstanter. Som standard blir det første enum-medlemmet tildelt verdien 0, og påfølgende medlemmer økes med 1.

            
enum Status {
  Pending,
  InProgress,
  Completed,
  Rejected,
}

const currentStatus: Status = Status.InProgress; // currentStatus will be 1

            

              
                Copy
              
            
          

Du kan også eksplisitt tilordne verdier til enum-medlemmer:

            
enum HTTPStatus {
  OK = 200,
  BadRequest = 400,
  Unauthorized = 401,
  Forbidden = 403,
  NotFound = 404,
}

const serverResponse: HTTPStatus = HTTPStatus.OK; // serverResponse will be 200

            

              
                Copy
              
            
          

Fordeler med Enums

• Lesbarhet: Enums forbedrer kodelesbarheten ved å gi meningsfulle navn for numeriske konstanter.
• Typesikkerhet: De håndhever typesikkerhet ved å begrense verdier til de definerte enum-medlemmene.
• Autokomplettering: IDE-er gir autokompletteringsforslag for enum-medlemmer, noe som reduserer feil.

Ulemper med Enums

• Runtime Overhead: Enums kompileres til JavaScript-objekter, noe som kan introdusere runtime overhead, spesielt i store applikasjoner.
• Mutasjon: Enums er mutable som standard. Mens TypeScript tilbyr const enum for å forhindre mutasjon, har den begrensninger.
• Omvendt Mapping: Numeriske enums oppretter en omvendt mapping (f.eks. Status[1] returnerer "InProgress"), som ofte er unødvendig og kan øke bundle-størrelsen.

Alternativ 1: Const Assertions

Const assertions gir en måte å opprette immutable, readonly datastrukturer. De kan brukes som et alternativ til enums i mange tilfeller, spesielt når du trenger et enkelt sett med streng- eller numeriske konstanter.

            
const Status = {
  Pending: 'pending',
  InProgress: 'in_progress',
  Completed: 'completed',
  Rejected: 'rejected',
} as const;

// Typescript infers the following type:
// {
//    readonly Pending: "pending";
//    readonly InProgress: "in_progress";
//    readonly Completed: "completed";
//    readonly Rejected: "rejected";
// }

type StatusType = typeof Status[keyof typeof Status]; // 'pending' | 'in_progress' | 'completed' | 'rejected'

function processStatus(status: StatusType) {
  console.log(`Processing status: ${status}`);
}

processStatus(Status.InProgress); // Valid
// processStatus('invalid'); // Error: Argument of type '"invalid"' is not assignable to parameter of type 'StatusType'.

            

              
                Copy
              
            
          

I dette eksemplet definerer vi et vanlig JavaScript-objekt med strengverdier. as const-assertionen forteller TypeScript å behandle dette objektet som readonly og inferere de mest spesifikke typene for dets egenskaper. Vi trekker deretter ut en union type fra nøklene. Denne tilnærmingen tilbyr flere fordeler:

Fordeler med Const Assertions

• Immutabilitet: Const assertions oppretter immutable datastrukturer, og forhindrer utilsiktede modifikasjoner.
• Ingen Runtime Overhead: De er enkle JavaScript-objekter, så det er ingen runtime overhead forbundet med enums.
• Typesikkerhet: De gir sterk typesikkerhet ved å begrense verdier til de definerte konstantene.
• Tree-shaking vennlig: Moderne bundlere kan enkelt tree-shake ubrukte verdier, og redusere bundle-størrelsen.

Betraktninger for Const Assertions

• Mer verbose: Å definere og typebestemme kan være litt mer verbose enn enums, spesielt for enkle tilfeller.
• Ingen Omvendt Mapping: De gir ikke omvendt mapping, men dette er ofte en fordel snarere enn en ulempe.

Alternativ 2: Union Types

Union types lar deg definere en variabel som kan inneholde en av flere mulige typer. De er en mer direkte måte å definere de tillatte verdiene uten et objekt, noe som er fordelaktig når du ikke trenger nøkkel-verdi-forholdet til en enum eller const assertion.

            
type Status = 'pending' | 'in_progress' | 'completed' | 'rejected';

function processStatus(status: Status) {
  console.log(`Processing status: ${status}`);
}

processStatus('in_progress'); // Valid
// processStatus('invalid'); // Error: Argument of type '"invalid"' is not assignable to parameter of type 'Status'.

            

              
                Copy
              
            
          

Dette er en konsis og typesikker måte å definere et sett med tillatte verdier.

Fordeler med Union Types

• Konsishet: Union types er den mest konsise tilnærmingen, spesielt for enkle sett med streng- eller numeriske konstanter.
• Typesikkerhet: De gir sterk typesikkerhet ved å begrense verdier til de definerte alternativene.
• Ingen Runtime Overhead: Union types eksisterer bare ved kompileringstidspunktet og har ingen runtime-representasjon.

Betraktninger for Union Types

• Ingen Nøkkel-Verdi Assosiasjon: De gir ikke et nøkkel-verdi-forhold som enums eller const assertions. Dette betyr at du ikke enkelt kan slå opp en verdi ved navn.
• String Literal Repetisjon: Du kan trenge å gjenta strengliteraler hvis du bruker det samme settet med verdier flere steder. Dette kan reduseres med en delt type-definisjon.

Når skal du bruke hvilken?

Den beste tilnærmingen avhenger av dine spesifikke behov og prioriteringer. Her er en veiledning for å hjelpe deg med å velge:

• Bruk Enums Når:
  • Du trenger et enkelt sett med numeriske konstanter med implisitt inkrementering.
  • Du trenger omvendt mapping (selv om dette sjelden er nødvendig).
  • Du jobber med eldre kode som allerede bruker enums i stor grad, og du har ikke et presserende behov for å endre det.
• Bruk Const Assertions Når:
  • Du trenger et sett med streng- eller numeriske konstanter som skal være immutable.
  • Du trenger et nøkkel-verdi-forhold og ønsker å unngå runtime overhead.
  • Tree-shaking og bundle-størrelse er viktige vurderinger.
• Bruk Union Types Når:
  • Du trenger en enkel, konsis måte å definere et sett med tillatte verdier.
  • Du trenger ikke et nøkkel-verdi-forhold.
  • Ytelse og bundle-størrelse er kritisk.

Eksempelscenario: Definere Brukerroller

La oss vurdere et scenario der du trenger å definere brukerroller i en applikasjon. Du kan ha roller som "Admin", "Editor" og "Viewer".

Bruke Enums:

            
enum UserRole {
  Admin,
  Editor,
  Viewer,
}

function authorize(role: UserRole) {
  // ...
}

            

              
                Copy
              
            
          

Bruke Const Assertions:

            
const UserRole = {
  Admin: 'admin',
  Editor: 'editor',
  Viewer: 'viewer',
} as const;

type UserRoleType = typeof UserRole[keyof typeof UserRole];

function authorize(role: UserRoleType) {
  // ...
}

            

              
                Copy
              
            
          

Bruke Union Types:

            
type UserRole = 'admin' | 'editor' | 'viewer';

function authorize(role: UserRole) {
  // ...
}

            

              
                Copy
              
            
          

I dette scenarioet tilbyr union types den mest konsise og effektive løsningen. Const assertions er et godt alternativ hvis du foretrekker et nøkkel-verdi-forhold, kanskje for å slå opp beskrivelser av hver rolle. Enums anbefales generelt ikke her med mindre du har et spesifikt behov for numeriske verdier eller omvendt mapping.

Eksempelscenario: Definere API Endpoint Statuskoder

La oss vurdere et scenario der du trenger å definere API endpoint statuskoder. Du kan ha koder som 200 (OK), 400 (Bad Request), 401 (Unauthorized) og 500 (Internal Server Error).

Bruke Enums:

            
enum StatusCode {
  OK = 200,
  BadRequest = 400,
  Unauthorized = 401,
  InternalServerError = 500
}

function processStatus(code: StatusCode) {
  // ...
}

            

              
                Copy
              
            
          

Bruke Const Assertions:

            
const StatusCode = {
  OK: 200,
  BadRequest: 400,
  Unauthorized: 401,
  InternalServerError: 500
} as const;

type StatusCodeType = typeof StatusCode[keyof typeof StatusCode];

function processStatus(code: StatusCodeType) {
  // ...
}

            

              
                Copy
              
            
          

Bruke Union Types:

            
type StatusCode = 200 | 400 | 401 | 500;

function processStatus(code: StatusCode) {
  // ...
}

            

              
                Copy
              
            
          

Igjen, union types tilbyr den mest konsise og effektive løsningen. Const assertions er et sterkt alternativ og kan foretrekkes da det gir en mer verbose beskrivelse for en gitt statuskode. Enums kan være nyttig hvis eksterne biblioteker eller APIer forventer heltallsbaserte statuskoder, og du vil sikre sømløs integrasjon. De numeriske verdiene samsvarer med standard HTTP-koder, noe som potensielt forenkler interaksjonen med eksisterende systemer.

Ytelsesbetraktninger

I de fleste tilfeller er ytelsesforskjellen mellom enums, const assertions og union types neglisjerbar. Men i ytelseskritiske applikasjoner er det viktig å være klar over de potensielle forskjellene.

• Enums: Enums introduserer runtime overhead på grunn av opprettelsen av JavaScript-objekter. Denne overheaden kan være betydelig i store applikasjoner med mange enums.
• Const Assertions: Const assertions har ingen runtime overhead. De er enkle JavaScript-objekter som behandles som readonly av TypeScript.
• Union Types: Union types har ingen runtime overhead. De eksisterer bare ved kompileringstidspunktet og slettes under kompilering.

Hvis ytelse er en viktig bekymring, er union types generelt det beste valget. Const assertions er også et godt alternativ, spesielt hvis du trenger et nøkkel-verdi-forhold. Unngå å bruke enums i ytelseskritiske deler av koden din med mindre du har en spesifikk grunn til å gjøre det.

Globale Implikasjoner og Beste Praksis

Når du jobber med prosjekter med internasjonale team eller globale brukere, er det avgjørende å vurdere lokalisering og internasjonalisering. Her er noen beste fremgangsmåter for å bruke enums og deres alternativer i en global kontekst:

• Bruk beskrivende navn: Velg enum-medlemsnavn (eller const assertion-nøkler) som er klare og entydige, selv for ikke-morsmålsbrukere av engelsk. Unngå slang eller sjargong.
• Vurder lokalisering: Hvis du trenger å vise enum-medlemsnavn til brukere, bør du vurdere å bruke et lokaliseringsbibliotek for å gi oversettelser for forskjellige språk. For eksempel, i stedet for å vise Status.InProgress direkte, kan du vise i18n.t('status.in_progress').
• Unngå kulturspecifikke antakelser: Vær oppmerksom på kulturelle forskjeller når du definerer enum-verdier. For eksempel kan datoformater, valutasymboler og måleenheter variere betydelig på tvers av kulturer. Hvis du trenger å representere disse verdiene, bør du vurdere å bruke et bibliotek som håndterer lokalisering og internasjonalisering.
• Dokumenter koden din: Gi klar og konsis dokumentasjon for dine enums og deres alternativer, og forklar deres formål og bruk. Dette vil hjelpe andre utviklere å forstå koden din, uavhengig av deres bakgrunn eller erfaring.

Eksempel: Lokalisere Brukerroller

La oss gå tilbake til eksemplet med brukerroller og vurdere hvordan du lokaliserer rollenavnene for forskjellige språk.

            
// Bruke Const Assertions med Lokalisering
const UserRole = {
  Admin: 'admin',
  Editor: 'editor',
  Viewer: 'viewer',
} as const;

type UserRoleType = typeof UserRole[keyof typeof UserRole];

// Lokaliseringsfunksjon (ved hjelp av et hypotetisk i18n-bibliotek)
function getLocalizedRoleName(role: UserRoleType, locale: string): string {
  switch (role) {
    case UserRole.Admin:
      return i18n.t('user_role.admin', { locale });
    case UserRole.Editor:
      return i18n.t('user_role.editor', { locale });
    case UserRole.Viewer:
      return i18n.t('user_role.viewer', { locale });
    default:
      return 'Ukjent Rolle';
  }
}

// Eksempelbruk
const currentRole: UserRoleType = UserRole.Editor;
const localizedRoleName = getLocalizedRoleName(currentRole, 'fr-CA'); // Returnerer lokalisert "Éditeur" for fransk kanadisk.
console.log(`Current role: ${localizedRoleName}`);

            

              
                Copy
              
            
          

I dette eksemplet bruker vi en lokaliseringsfunksjon for å hente det oversatte rollenavnet basert på brukerens språk. Dette sikrer at rollenavnene vises på brukerens foretrukne språk.

Konklusjon

TypeScript enums er en nyttig funksjon, men de er ikke alltid det beste valget. Const assertions og union types tilbyr levedyktige alternativer som kan gi bedre ytelse, immutabilitet og kodevedlikehold. Ved å forstå fordelene og ulempene ved hver tilnærming, kan du ta informerte beslutninger om hvilken du skal bruke i dine prosjekter. Vurder de spesifikke behovene til applikasjonen din, teamets preferanser og den langsiktige vedlikeholdsevnen til koden din. Ved å nøye vurdere disse faktorene, kan du velge den beste tilnærmingen for å definere konstanter i dine TypeScript-prosjekter, noe som fører til renere, mer effektive og mer vedlikeholdbare kodebaser.